<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:rich="http://richfaces.org/rich">


	<script type="text/javascript">
		function ShowDanhMuc() {
			document.getElementById("menuDanhMuc").style.display = "inline-block";
			document.getElementById("mnDanhMuc").className = "currentMainMenu";
		}
		function HideDanhMuc() {
			document.getElementById("menuDanhMuc").style.display = "none";
			document.getElementById("mnDanhMuc").className = "";
		}

		function ShowNhaSanXuat() {
			document.getElementById("menuNhaSanXuat").style.display = "inline-block";
			document.getElementById("mnNhaSanXuat").className = "currentMainMenu";
		}
		function HideNhaSanXuat() {
			document.getElementById("menuNhaSanXuat").style.display = "none";
			document.getElementById("mnNhaSanXuat").className = "";
		}
	</script>

	<div align="center">
		<div id="HeaderPanel" align="center">
			<!-- <a href="TrangGioHang.do?action=VaoGioHang" title="Giỏ hàng">
					<div class="rightFloatMenu" id="gioHang"></div>
				</a> -->
			<h:commandLink action="TrangGioHang?faces-redirect=true">
				<div class="rightFloatMenu" id="gioHang"></div>
			</h:commandLink>
			<div id="BannerPanel">
				<h:commandLink process="@this" immediate="true" action="TrangChu">
					<img class="logo imgNoBackgroundBorder" src="../Images/Logo.png" />
				</h:commandLink>
				<div id="HeaderRightPanel">
					<div id="LoggedStatusPanel">
						<c:choose>
							<c:when test="#{taiKhoanDangNhapBean.daDangNhap}">									
							Xin chào,
							<h:commandLink immediate="true" action="TrangTaiKhoanThanhVien"
									value="#{taiKhoanDangNhapBean.taiKhoan.hoten}" />
						| <h:commandLink immediate="true"
									action="#{taiKhoanDangNhapBean.DangXuat()}" value="Đăng xuất" />

								<br /> Giỏ hàng
								 <h:commandLink immediate="true" action="TrangGioHang"
									value="#{gioHangBean.lstSanPham.size()} sản phẩm" />
								<!-- <a
									href="TrangTaiKhoanThanhVien.do?action=TrangTaiKhoanThanhVien"
									title=""> #{taiKhoanDangNhapBean.taiKhoan.hoten} </a> | <a
									href="#" target="">Đăng xuất</a>
								<br /> Giỏ hàng <a href="TrangGioHang.do?action=VaoGioHang">
									${sessionScope.gioHang.size()
									+ 0} sản phẩm
								</a> -->
								<c:choose>
									<c:when test="#{taiKhoanDangNhapBean.isAdmin()}">
										<br />
										<h:link immediate="true" value="Vào trang Quản Lý"
											outcome="AdminHome" />
										<!-- <a href="AdminHome.do?action=VaoTrangAdmin"> Vào trang
											Quản Lý </a> -->

									</c:when>
								</c:choose>
							</c:when>
							<c:otherwise>
								<h:commandLink immediate="true"
									action="TrangDangNhap?faces-redirect=true" value="Đăng nhập" /> | 
											<h:commandLink immediate="true"
									action="TrangDangKy?faces-redirect=true" value="Đăng kí" />
								<!-- <a href="#" title="">Đăng Nhập</a> | <a href="#" target="">Đăng
									kí</a> -->
							</c:otherwise>
						</c:choose>
					</div>
					<hr />
					<div id="SearchPanel">

						<!-- <input id="inputTimKiem" class="txtField" type="text" name="txtTim"
									size="auto" value="" /> -->

						<h:inputText id="inputTimKiem" class="txtField"
							value="#{headerBean.chuoitimkiem}" />



						<h:commandLink id="SearchButton" class="block"
							action="TrangKetQuaTimKiemCB?faces-redirect=true" value="Tìm" />



						<!-- <a href="#" id="SearchButton" class="block">Tìm </a> -->
					</div>

					<!-- Tim nc -->
					<!-- <h:commandLink class="block"
							action="TrangTimKiemNC?faces-redirect=true" value="Tìm NC" /> -->

				</div>
			</div>
			<div align="center">
				<div align="center" id="MenuPanel">
					<ul class="menu">
						<li><h:link immediate="true" outcome="TrangChu">
								<span>Trang chủ</span>
							</h:link></li>

						<li><h:commandLink immediate="true" action="#">
								<span>Sản phẩm hot</span>
							</h:commandLink></li>
						<li class="" onmouseover="ShowDanhMuc()"
							onmouseout="HideDanhMuc()"><h:commandLink id="mnDanhMuc"
								immediate="true">
								<span>Danh mục</span>
							</h:commandLink></li>
						<li class="" onmouseover="ShowNhaSanXuat()"
							onmouseout="HideNhaSanXuat()"><h:commandLink id="mnNhaSanXuat"
								immediate="true">
								<span>Nhà Sản Xuất</span>
							</h:commandLink></li>
						<!-- <li><h:commandLink immediate="true" action="#">
								<span>Chức năng</span>
							</h:commandLink></li>
						<li><h:commandLink immediate="true" action="#">
								<span>Giúp đỡ</span>
							</h:commandLink></li>
						<li><h:commandLink immediate="true" action="#">
								<span>Liên hệ</span>
							</h:commandLink></li> -->
						<li><h:link immediate="true" outcome="TrangTimKiemNC">
								<span>Tìm kiếm</span>
							</h:link></li>

					</ul>

					<div class="menuPopup" id="menuDanhMuc" onmouseover="ShowDanhMuc()"
						onmouseout="HideDanhMuc()">
						<ul class="subMenu">
							<ui:repeat value="#{headerBean.lstDanhMuc}" var="danhMuc">
								<li><h:commandLink
										action="#{headerBean.ChuyenTrangSanPhamTheoDanhMuc(danhMuc.manhom)}">
										<span>#{danhMuc.getTennhom()}</span>
									</h:commandLink></li>
							</ui:repeat>
						</ul>
					</div>
					<div class="menuPopup" id="menuNhaSanXuat"
						onmouseover="ShowNhaSanXuat()" onmouseout="HideNhaSanXuat()">
						<ul class="subMenu">
							<ui:repeat value="#{headerBean.lstNhaSanXuat}" var="nsx">
								<li><h:commandLink
										action="#{headerBean.ChuyenTrangSanPhamTheoNhaSanXuat(nsx.manhasanxuat)}">
										<span>#{nsx.tennhansanxuat}</span>
									</h:commandLink></li>
							</ui:repeat>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</ui:composition>
